<template>
  <div class="selectionKnowledge">
    <el-tree
      ref="treek"
      :data="treeData"
      show-checkbox
      node-key="id"
      :default-expand-all="true"
      :default-checked-keys="defaultCheckedKeys"
      :props="defaultProps"
      @check="handleCheckChange"
    >
    </el-tree>
  </div>
</template>
<script>
import { knowledgeListBases } from "@/api/KnowledgeBaseManagement";
export default {
  components: {},
  data() {
    return {
      treeData: [
        {
          id: 1,
          label: "公共文档库",
          // children: [
          //   {
          //     id: 4,
          //     label: "二级 1-1",
          //   },
          // ],
        },
        {
          id: "个人知识库",
          label: "个人知识库",
          children: [],
        },
      ],
      defaultProps: {
        children: "children",
        label: "label",
      },
      defaultCheckedKeys: [],
    };
  },
  mounted() {
    this.getUserKnowledge();
  },
  methods: {
    // getCheckedKeys() {
    //   console.log(this.$refs.tree.getCheckedKeys());
    // },
    handleCheckChange(data, checked, indeterminate) {
      if (checked.checkedNodes.length < 1) {
        this.$store.commit("toggle_selectionKnowledge", [
          {
            id: 1,
            label: "公共文档库",
          },
        ]);
        this.$refs.treek.setCheckedKeys([1]);
      } else {
        this.$store.commit("toggle_selectionKnowledge", checked.checkedNodes);
      }
    },
    getUserKnowledge() {
      this.defaultCheckedKeys = [...this.$store.state.selectionKnowledge];
      knowledgeListBases({
        size: 1000000,
        page: 1,
      })
        .then((result) => {
          let arr = result.data.records.filter((v) => !v.libName.includes("dev-cx-temp"));
          this.treeData[1].children = arr.map((v) => {
            return {
              id: v.id,
              label: v.libName,
            };
          });
          this.$nextTick(() => {
            this.$refs.treek.setCheckedKeys([...this.$store.state.selectionKnowledge.map((v) => v.id)]);
          });
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
};
</script>
<style lang="scss" scoped>
.selectionKnowledge {
  width: 100%;
  height: calc(100% - 40px);
  padding-right: 15px;
  ::v-deep .el-tree-node__content {
    height: auto;
    .el-tree-node__label {
      font-size: 16px;
      line-height: 30px;
    }
  }
}
</style>
